
import { Space } from "antd";
import React, { useEffect, useRef } from "react";
import { Tabs, Form, Input, Checkbox, Button } from 'antd';
import type { TabsProps } from 'antd';
import PasswordLogon from './PasswordLogon'
import PhoneNumberLogon from './PhoneNumberLogon'



const Logon: React.FC = () => {
    return (
        <div style={{ display: 'flex', justifyContent: 'center', alignItems: 'center', width: '100vh' }}>
            <Space direction="vertical" align="center" style={{ width: "328px", display: 'flex' }}>
                <h1>Ant Design</h1>
                Ant Design 是西湖区最具影响力的 Web 设计规范
                <Tabs defaultActiveKey="1" items={items} onChange={onChange} style={{ width: "100%", flex: 1 }}></Tabs>
            </Space>
        </div>
    );
};

export default Logon;

const onChange = (key: string) => {
    console.log(key);
};

const items: TabsProps['items'] = [
    {
        key: 'passwordLogon',
        label: '账户密码登录',
        children: <PasswordLogon></PasswordLogon>,
    },
    {
        key: 'phoneNumberLogon',
        label: '手机号登录',
        children: <PhoneNumberLogon></PhoneNumberLogon>,
    },

];




